import { cn } from "@versakit/shared"
import * as React from "react"
import type { {{pascalCase name}}Props } from "./{{kebabCase name}}.types"
import { {{camelCase name}}Variants } from "./{{kebabCase name}}.variants"

const {{pascalCase name}} = React.forwardRef<HTMLDivElement, {{pascalCase name}}Props>(
	({ className, ...props }, ref) => {
		return (
			<div
				ref={ref}
				className={cn({{camelCase name}}Variants({ className }))}
				{...props}
			/>
		)
	},
)
{{pascalCase name}}.displayName = "{{pascalCase name}}"

export { {{pascalCase name}} }
export type { {{pascalCase name}}Props }
export { {{camelCase name}}Variants }
